<template>
	<view class="pages">
		<view class="head">
			<h-nav-bar :fixed="true" backgroundColor="rgba(0,0,0,0)"></h-nav-bar>
			<view class="head_box">
				<view class="head_box_t">咪 婴 伴 侣</view>
				<view class="head_box_b">医生在线职业首选平台</view>
			</view>
		</view>
		<view class="section">
			<view class="sec_title">请选择您的业务</view>
			<view class="sec_box clear" v-for="(item, index) in businesList" :key="index">
				<image class="sec_box_img left" :src="item.icon"></image>
				<view class="sec_box_cen left">
					<view class="sec_box_cen_t clear">
						<view class="left">{{ item.name }}</view>
						<view class="right" v-show="item.user_has_business == 1"><text class="left"></text>已开通</view>
					</view>
					<view class="sec_box_cen_b">{{ item.explain }}</view>
				</view>
				<view class="sec_btn sec_btna right" v-show="item.user_has_business == 0" @click="toOpen(item, index)">开通</view>
				<view class="sec_btn sec_btnb right" v-show="item.user_has_business == 1" @click="toClear(item, index)">关闭</view>
			</view>
		</view>
		<h-modal :show="tiShow" titlea="您未完成医师认证，无法开通" titleb="相关业务" leftBtn="取消" rightBtn="去认证" @clear="tiShow = false" @bind="toPhy"></h-modal>
		<h-modal :show="affirmShow" titlea="确认申请开通相关业务" leftBtn="取消" rightBtn="提交审核" @clear="affirmShow = false" @bind="toAudit"></h-modal>
		<h-modal :show="clearShow" titlea="关闭业务后，无法接单" leftBtn="确认关闭" rightBtn="取消" leftColor="#5C5C5C" rightColor="#202020" @clear="toClearBiness" @bind="clearShow = false"></h-modal>
	</view>
</template>

<script setup lang="ts">
	import { ref, reactive, nextTick } from 'vue'
	import { formatDate } from '@/utils/utils'
	import { navigateTo, showToast, navigateBack, redirectTo } from '@/utils'
	import {
		onLoad,
		onPullDownRefresh,
		onReachBottom,
		onReady,
		onShow,
		onPageScroll,
		onUnload,
		onHide,
		onBackPress,
	} from '@dcloudio/uni-app'
	import { uploadApi } from '@/utils/upLoad'
	import { useMemberStore } from '@/stores'
	import { doctorInfo } from '@/api/home'
	import { getDoctorTransaction, getDoctorCloseTransaction } from '@/api/business'
	const login = ref(null) // 登录组件实例
	const store = useMemberStore()
	var token = store?.token
	const statusHeight = ref(0)
	const tiShow = ref(false)
	const affirmShow = ref(false)
	const clearShow = ref(false)
	const status = ref(0) //医师认证审核状态
	const isOrder = ref(false) //是否有订单
	const businesList = ref([])
	const busDetail = ref({})
	onLoad((o) => {})
	onShow(() => {
		getBusiness()
		getDoctorInfo()
	})
	onReady(() => {
		uni.getSystemInfo({
			success: (e) => {
				statusHeight.value = e.statusBarHeight * 2
			},
		})
	})

	async function getDoctorInfo() {
		const res = await doctorInfo()
		status.value = res.data.is_apply_audit
	}
	async function getBusiness() {
		const res = await getDoctorTransaction()
		businesList.value = res.data
	}

	function toOpen(row, index) {
		if(status.value == 0) {
			showToast('医师认证审核中，请耐心等待')
		} else if(status.value == 1) {
			busDetail.value = row
			affirmShow.value = true
		} else {
			tiShow.value = true
		}
	}

	function toClear(row, index) {
		busDetail.value = row
		clearShow.value = true
	}

	function toPhy() {
		navigateTo('/pages-users/my-page/physician')
		tiShow.value = false
	}

	function toAudit() {
		affirmShow.value = false
		navigateTo('/pages-users/business-management/open?id=' + busDetail.value.id + '&title=' + busDetail.value.name)
	}
	async function toClearBiness() {
		const res = await getDoctorCloseTransaction({
			transaction_id: busDetail.value.id,
		})
		if(res.code == 200) {
			clearShow.value = false
			getBusiness()
			showToast(res.message)
		} else {
			showToast(res.message)
		}
	}
</script>

<style>
	page {
		background: #fff;
	}
</style>
<style lang="scss" scoped>
	.pages {
		box-sizing: border-box;
		width: 750rpx;
		overflow: hidden;
	}
	
	.clear:after {
		/*START 真正起到清除浮动的代码*/
		content: '';
		display: block;
		clear: both;
		/*END 真正起到清除浮动的代码*/
		height: 0;
	}
	
	.clear {
		display: inline-block;
	}
	
	.left {
		float: left;
	}
	
	.right {
		float: right;
	}
	
	.head {
		width: 750rpx;
		height: 750rpx;
		position: relative;
		background: url(@/static/index/bj.png) no-repeat;
		background-size: 750rpx 750rpx;
		.head_img {
			width: 88rpx;
			height: 88rpx;
			padding: 24rpx;
			box-sizing: border-box;
		}
		.head_box {
			position: absolute;
			bottom: 90rpx;
			left: 0;
			width: 260rpx;
			height: 120rpx;
			box-sizing: border-box;
			padding: 20rpx 30rpx;
			background: rgba(0, 159, 152, 0.7);
			.head_box_t {
				font-family: PingFangSC, PingFang SC;
				font-weight: bold;
				font-size: 40rpx;
				color: #ffffff;
				line-height: 48rpx;
				text-align: center;
				text-shadow: 2px 2px 0px #009f98;
			}
			.head_box_b {
				font-family: PingFangSC, PingFang SC;
				font-weight: 400;
				font-size: 20rpx;
				color: #ffffff;
				line-height: 28rpx;
				text-align: center;
				text-shadow: 1px 1px 0px #009f98;
			}
		}
	}
	
	.section {
		width: 750rpx;
		background: #ffffff;
		box-shadow: 0rpx -10rpx 30rpx 0rpx rgba(0, 193, 185, 0.1);
		border-radius: 40rpx 40rpx 0rpx 0rpx;
		box-sizing: border-box;
		margin-top: -40rpx;
		padding: 0 24rpx;
		position: relative;
		.sec_title {
			font-family: PingFangSC, PingFang SC;
			font-weight: 500;
			font-size: 30rpx;
			color: #202020;
			line-height: 42rpx;
			padding-top: 30rpx;
		}
		.sec_box {
			width: 702rpx;
			height: 180rpx;
			background: #f5f6f8;
			border-radius: 20rpx;
			box-sizing: border-box;
			padding: 30rpx 20rpx;
			margin-top: 20rpx;
			.sec_box_img {
				width: 90rpx;
				height: 90rpx;
				border-radius: 45rpx;
				margin-top: 15rpx;
			}
			.sec_box_cen {
				width: 392rpx;
				margin-left: 20rpx;
				.sec_box_cen_t {
					.left {
						font-family: PingFangSC, PingFang SC;
						font-weight: 600;
						font-size: 30rpx;
						color: #202020;
						line-height: 42rpx;
					}
					.right {
						font-family: PingFangSC, PingFang SC;
						font-weight: 400;
						font-size: 26rpx;
						color: #00c1b9;
						line-height: 37rpx;
						padding-top: 5rpx;
						text {
							width: 14rpx;
							height: 14rpx;
							background: #00c1b9;
							border-radius: 50%;
							margin-right: 10rpx;
							margin: 12rpx 10rpx 12rpx 20rpx;
						}
					}
				}
				.sec_box_cen_b {
					font-family: PingFangSC, PingFang SC;
					font-weight: 400;
					font-size: 26rpx;
					color: #5c5c5c;
					line-height: 37rpx;
					margin-top: 5rpx;
				}
			}
		}
		.sec_btn {
			width: 110rpx;
			height: 50rpx;
			border-radius: 25rpx;
			font-family: PingFangSC, PingFang SC;
			font-weight: 400;
			font-size: 26rpx;
			line-height: 50rpx;
			text-align: center;
			font-style: normal;
			margin-top: 40rpx;
		}
		.sec_btna {
			background: #00c1b9;
			color: #ffffff;
		}
		.sec_btnb {
			background: #fff;
			color: #cb5000;
		}
	}
</style>